<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                template="/templates/mainLayout.xhtml">

    <ui:define name="title">Thông tin tài khoản</ui:define>
    <ui:define name="content">
        <h:form id="mainForm">
            <p:panel header="Thông tin tài khoản">
                <p:messages id="msgs"/>
                <p:toolbar style="margin-bottom: 10px; margin-top: 10px;">
                    <p:toolbarGroup align="left">
                        <p:commandButton value="Sửa" action="#{profileBean.preEditAction}" update="mainForm" rendered="#{profileBean.user != null}"/>
                    </p:toolbarGroup>
                </p:toolbar>
                
                <h:panelGrid styleClass="panelGrid" columnClasses="ui-state-default labelCol, ui-widget-content" 
                             columns="2" cellpadding="5" width="100%" rendered="#{profileBean.user != null}">  
                    <h:outputLabel for="email" style="display: inline; float: right; padding-right: 5px;" value="Email" />  
                    <h:outputText value="#{profileBean.user.email}" id="email" />
                    
                    <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Tài khoản VXu" />  
                    <h:outputText value="#{profileBean.getAmount()}"/>

                    <h:outputLabel for="fullName" style="display: inline; float: right; padding-right: 5px;" value="Tên đầy đủ" />  
                    <h:outputText value="#{profileBean.user.fullName}" id="fullName"/>
                    
                    <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Trạng thái" />  
                    <h:panelGroup>
                        <h:outputText rendered="#{profileBean.user.activated}" value="Activated"/>
                        <h:outputText rendered="#{!profileBean.user.activated}" value="Inactivate"/>
                    </h:panelGroup>
                    
                    <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Loại" />
                    <h:panelGroup>
                        <h:outputText rendered="#{profileBean.user.external}" value="External"/>
                        <h:outputText rendered="#{!profileBean.user.external}" value="Internal"/>
                    </h:panelGroup>
                    
                    <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Nhóm" />
                    <h:panelGroup>
                        <ui:repeat value="#{profileBean.user.groups}" var="group">
                            <h:outputText value="[#{group.name}] "/>
                        </ui:repeat>
                    </h:panelGroup>
                    
                    <h:outputLabel style="display: inline; float: right; padding-right: 5px;" value="Ngày đăng ký" />
                    <h:outputText value="#{utilBean.formatDate(profileBean.user.createdDate, 'dd/MM/yyyy HH:mm')}"/>
                </h:panelGrid>

                <p:toolbar style="margin-bottom: 10px; margin-top: 10px;">
                    <p:toolbarGroup align="left">
                        <p:commandButton value="Sửa" action="#{profileBean.preEditAction}" update="mainForm" rendered="#{profileBean.user != null}"/>
                    </p:toolbarGroup>
                </p:toolbar>
            </p:panel>
        </h:form>
    </ui:define>
</ui:composition>